<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	</head>
	<body>
		<div id="layout_center_tabs" class="easyui-tabs" 
			data-options="fit:true,border:false,plain:true">
			
			<div title="About"
				data-options="href:'${pageContext.request.contextPath}/js/jquery-easyui-1.3.2/demo/layout/_content.html'"
				style="padding: 10px"></div>
			
			<div title="DataGrid" style="padding: 5px">
				<table class="easyui-datagrid"
					data-options="url:'${pageContext.request.contextPath}/js/jquery-easyui-1.3.2/demo/layout/datagrid_data1.json',singleSelect:true,fit:true,fitColumns:true">
					<thead>
						<tr>
							<th data-options="field:'itemid'" width="80">
								Item ID
							</th>
							<th data-options="field:'productid'" width="100">
								Product ID
							</th>
							<th data-options="field:'listprice',align:'right'" width="80">
								List Price
							</th>
							<th data-options="field:'unitcost',align:'right'" width="80">
								Unit Cost
							</th>
							<th data-options="field:'attr1'" width="150">
								Attribute
							</th>
							<th data-options="field:'status',align:'center'" width="50">
								Status
							</th>
						</tr>
					</thead>
				</table>
			</div>
			
			<div title="测试" data-options="" style="padding: 10px"></div>
			
		</div>
		<script type="text/javascript">
		var index = 0
		function add(){  
            index++;  
            $('#layout_center_tabs').tabs('add',{  
                title: 'Tab'+index,  
                content: '<div style="padding:10px">Content'+index+'</div>',  
                closable: true  
            }); 
        }
		</script>
	</body>
</html>
